<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
%>
<jsp:include page="/share/top.jsp" />
<script type="text/javascript" src="<%=path%>/js/core/helper.js"></script>
<script type="text/javascript" src="<%=path%>/js/buildingSelect.js"></script>
<SCRIPT language="javascript">
	var layer;

    function queryOnclick(){
    	queryCardList();
	}
    
    var modelParam = {};
    modelParam.pageSize = 10;
    function queryCardList(){
    	var roomInfo = "";
    	var param = {};
    	param.ownerName = $('.ownerName').val();
    	param.pageSize = modelParam.pageSize;
    	param.page = 1;

    	roomInfo += $("select[name='commCode']").val();
    	roomInfo += $("select[name='areaCode']").val();
    	roomInfo += $("select[name='buildingCode']").val();
    	roomInfo += $("select[name='unitCode']").val();
    	roomInfo += $("select[name='roomId']").val();
    	console.log(roomInfo);
    	param.roomInfo = roomInfo;
    	param.state = $("select[name='state']").val();
    	param.cardType = $("select[name='cardType']").val();

    	postJson("<%=path%>/card/queryBrush.x",$.param(param), function(data){
    		$('#tbody').empty();
    		render(data.list);
    		layui.laypage({
    			cont: 'page'
    			,pages: Math.ceil(data.size/modelParam.pageSize)
    			,jump: function(row, first){
    				if(!first){
    					param.page = row.curr;
    					queryPage(param);
    				}
    			}
    		});
    	});
    }
    
    function deleteBrushCard(){
    	var param = {};
    	param.deleteCard = "";
        $('input[name="deleteCard"]:checked').each(function(){
        	param.deleteCard += $(this).val()+",";    
          });
    	postJson("<%=path%>/card/deleteBrushCard.x",$.param(param), function(data){
    		queryCardList();
    	});
	}
    
    
    /* 卡挂失操作 */
    function lost(obj,state){
    	var param = {};
    	param.cardNo = $(obj).parent().parent().children(".t1").text();
    	param.LostOrResume = state;
    	var confirmStr = state == 'resume'?"确定要恢复该卡么":"确定要挂失该卡么?挂失后改卡将无法使用！";
    	var successStr = state == 'resume'?"恢复成功！":"挂失成功！";
   		layer.confirm(confirmStr,{btn:['确认','取消'],btn1:function(){
   			postJson("<%=path%>/card/lost.x",$.param(param), function(data){
   	    		layer.alert(successStr);
   	    		queryCardList();
   	    	});
   		}});
    	
    }
    
    function view(obj) {
    	var param = {};
    	param.cardNo = obj;
    	postJson("<%=path%>/card/findCard.x",$.param(param), function(data){
    		var output="<hr/>";
    		for ( var i=0; i<data.cardPerms.length; i++) {
    			output+='&nbsp&nbsp&nbsp&nbsp'+data.cardPerms[i].devStr+'&nbsp&nbsp&nbsp&nbsp<br><hr/>';
    		}
    		console.log(output);
    		layer.open({
        		title: '该卡权限',
        		type: 1,
        		shadeClose: true, 
        		content: output
        	});
    		}
    	);
    	
    }
    
    function render(list) {
    	$('#tbody').append();
    	for(var i in list) {
    		$('#tbody').append(
    				'<tr>'+
    				'<td class="t1">'+list[i].cardNo+'</td>'+
    				'<td class="t2">'+list[i].ownerName+'</td>'+
    				'<td class="t3">'+(list[i].roomInfo == undefined?"业主不存在":list[i].roomInfo)+'</td>'+
    				'<td class="t4">'+list[i].swipeCardTime+'</td>'+
    				'<td class="t5">'+'<label><input name="deleteCard" type="checkbox" value="'+list[i].id+'"/></label>'+'</td>'+
    				'</tr>'
    				);
    	}
    	$('#tbody').append("<tr></tr>");
    }
    
    function queryPage(param){
    	postJson("<%=path%>/card/queryBrush.x",$.param(param), function(data){
    		$('#tbody').empty();
    		render(data.list);
    	});
    }
    
    layui.use([ 'jquery','form','element','laypage','layer'], function(){
    	layer = layui.layer;
    	   	
    	var commCodeStr = '${commDimBo.commCode}';
    	console.log("commcode "+commCodeStr);
    	setCommSelect("commCode");
		setAreaSelect("areaCode");
		setBuildingSelect("buildingCode");
		setUnitSelect("unitCode");
		setRoomSelect("roomId");
		
		setUrl('<%=path%>/BuildingsCtrl/getUnitsInfo.x');
		
    	if (commCodeStr != null && commCodeStr != '')
    	{
    		getSelectData(commCodeStr);
    	}
    	
    	queryCardList();
    });
</SCRIPT>

<div id="rightcontent">
  <div class="inner">
    <div class="title"><div class="border">
    	姓名<input type="text" name="ownerName" class="ownerName" style="width:100px"/>&nbsp&nbsp
    	<c:if test="${!empty commDimList}">
	            小区:
	         <select name="commCode" onchange="changeComm();">
	          		<option value="">--全选--</option>
	           		<c:forEach var="comm" items="${commDimList}">
						<option value='${comm.commCode }'>
							${comm.commCode }-${comm.commName}
						</option>
					</c:forEach>
					</select>
	    </c:if>
	    <c:if test="${!empty commDimBo}">
	    	<select name="commCode" style="display:none">
	    		<option value="${commDimBo.commCode}" selected></option>
	    	</select>
	    </c:if>

	           	<c:if test="${empty commDimList && empty commDimBo}">
	           	小区
	           	<select name="commCode" onchange="changeComm();">
	           		<option value="">--无法识别小区--</option>
	           		</select>
	           	</c:if>
	           		 
	           	栋数:<select name="areaCode" onchange="changeArea();">
	           	 <c:if test="${empty ownerFrom.areaCode}">
	        	 	<option value="">--全选--</option>
	          	 </c:if>
	          	 </select>
	       		 单元:<select name="buildingCode" onchange="changeBuilding();">
	        		 <c:if test="${empty ownerFrom.buildingCode}">
	           		 <option value="">--全选--</option>
	           		 </c:if>
	           	 </select>
	           		 
	           	 楼宇:<select id="unit_Code" name="unitCode" onchange="changeUnit();">
				<option value="">--全选--</option></select> 
					
				房号:<select id="room_Id" name="roomId">
				<option value="">--全选--</option>
				</select>
    	
	
	    &nbsp&nbsp
	    <button type="button" class="layui-btn layui-btn-normal layui-btn-small" onclick="queryOnclick()">
	    	<i class="layui-icon" style="vertical-align: middle">&#xe615;</i>&nbsp 查询
	    </button>
    </div>
    </div>
    
	<div class="table-responsive">
      <table class="table layui-table" cellpadding="0" cellspacing="0">
        <thead>
        <tr>
            <th class="t1">门禁卡编号</th>
            <th class="t2">业主名称</th>
            <th class="t3">住宅信息</th>
            <th class="t4">刷卡时间</th>
            <th class="t5">操作 </th>
          </tr>
        </thead>
     <tbody id="tbody">
     </tbody>
    </table>
   </div>
   	<div id="page" style="float:left;"></div>
	<div style="float:right;padding-top:6px"><button type="button" class="layui-btn layui-btn-danger layui-btn-small" onclick="deleteBrushCard()">
	    	 删除选中项
	    </button></div>
  </div>
 </div>
<div style="clear: both"></div>

<jsp:include page="/share/foot.jsp" />
